<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <meta name="renderer" content="webkit"/>
    <meta name="referrer" content="always"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <meta name="theme-color" content="rgb(204,232,207)"/>
    <meta name="author" content="王振"/>
    <meta name="generator" content="Adobe DreamWeaver CC 2017,Hbuilder"/>
    <meta name="keywords" content="HTML, CSS, 个人网页,学生,初级"/>
    <meta name="description" content="这是我在大学时期做的个人网页，欢迎访问！限于作者水平，可能效果并不理想，敬请见谅！"/>
    <title>欢迎访问</title>
    <link rel="shortcut icon" type="image/icon" href="/favicon.ico"/>
    <script type="text/javascript">
        var index;
        if (index = location.href.indexOf("?") > -1) {
            location.href = "kill370354.gz01.bdysite.com/" + location.href.substr(index + 1);
        }
    </script>
    <style>
        html,
        body {
            margin: 0 auto;
        }

        /*适应不同分辨率的屏幕*/
        span {
            /*倒计时文字，位于左上角*/
            position: fixed;
            margin: 10px;
        }

        /*显示倒计时的位置*/
        #background {
            /*设定放置背景图片的div，之所以不放在body里面，是为了使得背景图片能够拉伸，而如果在body中不能够实现*/
            position: absolute;
            /*设定放置背景图片的div位置属性*/
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
            z-index: -1;
            /*这是为了有背景效果*/
        }

        #background img {
            display: block;
            position: absolute;
            /*设定背景图片位置属性*/
            width: 100%;
            /*设定背景图片*/
            height: 100%;
            top: 0;
            /*设定背景图片位置属性*/
            left: 0;
        }

        #centertext {
            width: 12em;
            height: 180px;
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0; /*css溢出法*/
            margin: auto;
        }

        .chinese {
            /*欢迎文字*/
            color: #000;
            font-family: "华文行楷", "隶书", "楷体";
            /*设置中文字体，防止在各种电脑上不能正常显示，多设置几个字体*/
            font-size: 2em;
            text-align: center;
            overflow: visible;
            text-shadow: 1px 1px 1px #111, 1px 1px 1px #222, 1px 1px 1px #333;
            /*文字阴影效果*/
        }

        .english {
            /*欢迎文字*/
            position: absolute;
            font-family: "Times New Roman", Times, serif;
            /*设置英文字体*/
            font-size: 2em;
            text-align: center;
            margin: 0 auto;
            top: 3em;
            bottom: 0;
            left: 0;
            right: 0; /*css溢出法*/
            /*使英文单词居中*/
            height: 40px;
            width: 200px;
            overflow: visible;
        }

        a:link {
            color: rgb(0, 153, 0);
        }

        a:visited {
            color: rgb(82, 124, 106);
        }

        a:hover {
            color: rgb(255, 132, 0);
        }

        a:active {
            color: rgb(0, 0, 0);
        }
    </style>
    <script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?b29463c42b922f545c2ae582dcca04c6";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();
</script>

</head>
<body>
<div id="background"><img id="img" src="images/1.jpg"/></div>
<span id="show"></span>
<div id="centertext">
    <div class="chinese">欢迎访问我的
        <a href="index2.html">个人主页</a>
    </div>
    <!--欢迎文字-->
    <div class="english"><b>WELCOME</b></div>
</div>
<!--欢迎文字-->
<!--下列js代码是从网上复制的-->
<script type="text/javascript">
    var t = 5; //设定页面自动跳转的时间
    setInterval("refer()", 1000); //启动1秒定时
    function refer() {
        if (t == 0) {
            location = "index2.html"; //#设定跳转的链接地址
            return;
        }
        document.getElementById("show").innerHTML = t + "秒后自动跳转"; // 显示倒计时
        t--; // 计数器递减
    }

    var curIndex = 1; //设定背景图片自动切换
    //时间间隔(单位毫秒)，每3秒钟显示一张，数组共有2张图片放在images文件夹下，这两张图片均取自w.qq.com，虽然分辨率高，占用空间却很小，这种技术日后一定要学
    var arr = new Array();
    arr[0] = "images/1.jpg";
    arr[1] = "images/2.jpg";
    setInterval(changeImg, 2000);

    function changeImg() {
        var img = document.getElementById("img");
        img.src = arr[(curIndex++) % 2];
    }
    var oMyHeight = document.body.clientHeight || window.innerHeight;
    //alert(oMyHeight); //各浏览器均取前者，均支持document.body.clientHeight属性,IE 6、7、8显示undefined,IE5 有显示
    //若要使在body过高时能够实现同时两边上下分离的效果，必须使用window.innerHeight
    var oMyWidth = document.body.clientWidth ? document.body.clientWidth : window.innerWidth;
    //alert(oMyWidth);
    //alert(document.body.clientWidth);//均是浏览器内屏幕宽度，不含滚动条1903
    //alert(document.body.clientHeight);//均是body实际高度，不管是否满屏，不含滚动条
    //alert(window.innerWidth);//均含滚动条1920
    //alert(window.innerHeight);//均取浏览器内屏幕高度，含滚动条不含状态栏
    var s = " ";
    for(i = 1; i <= 16; i++) {
        s = s + '  <div id="i' + i + '" style="z-index:1;width:100px;height:' + oMyHeight + '%;position:fixed;left:0px;top:0px;background-image: url(images/1.jpg); background-position:' + (i - 1) * 100 / 16 + '% 0%; background-repeat:no-repeat;  "></div>'; //原本想设置合适宽度的背景，使div集合与真实背景图片相融合，但是需要拉伸，且那样的话可能 看不出来div变化，所以如此而已
    }
    document.body.innerHTML += s;
    var speed = 5;
    var temp = new Array();
    var a = document.getElementsByTagName("body")[0];
    var oMyTop = 0;
    for (i = 1; i <= 16; i++) {
        temp[i] = document.getElementById("i" + i);
        temp[i].style.width = oMyWidth / 16 + "px";
        temp[i].style.height = oMyHeight + "px";
        temp[i].style.left = (i - 1) * oMyWidth / 16 + "px";
    }

    function kind() {
        oMyHeight -= speed;
        for (i = 1; i <= 16; i = i + 2) {
            temp[i].style.clip = "rect(auto,auto," + oMyHeight + "px," + "auto)";
        }
        oMyTop += speed;
        for (i = 2; i <= 16; i = i + 2) {
            temp[i].style.clip = "rect( " + oMyTop + "px" + ",auto,auto,auto)";
        }
        if (oMyHeight <= 0) clearInterval(time);
    }

    time = setInterval(kind, 15); //div缓慢消失
</script>
<script src="js/xhr.js"></script>
<script src="js/statistics.js"></script>
</body>
</html>
